<!DOCTYPE html>
<html lang="en">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Provider View</title>
    <meta name="author" content="Joey Freeland" />
    <link rel="stylesheet" type="text/css" href="http://www.google.com/css/maia.css">
    <link rel="stylesheet" type="text/css" href="/css/provider.css" />
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.load("visualization", "1", {packages:["corechart"]});
      google.load("visualization", "1", {packages: ["annotatedtimeline"]});
    </script>
    <script type="text/javascript"
    src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
    </script>
    <script type="text/javascript">
      var provider = "{{ provider }}";
      var device = "{{ device }}";
      var ssid = "{{ ssid }}";
    </script>
    <script type="text/javascript" src="/js/provider_device_ssid.js"></script>
  </head>
  <body>
    <div id="maia-header">
      <h1>Wi-Fi Monitoring Dashboard</h1>
      <h2>{{ provider }}</h2>
      <h2>{{ device }}</h2>
      <h2>{{ ssid }}</h2>
    </div>
    <div align="center" id="charts">
      <table id="provider_dashboard">
        <tbody>
          <tr>
            <td class="chart_column">
              <center>
                <div id="time_since_last_result" class="chart"></div>
              </center>
            </td>
            <td class="chart_column">
              <div id="neighbors" class="chart"></div>
            </td>
          </tr>
          <tr>
          <tr>
            <td class="chart_column">
              <div id="ndt_down" class="chart"></div>
            </td>
            <td class="chart_column">
              <div id="ndt_up" class="chart"></div>
            </td>
          </tr>
          <tr>
            <td class="chart_column">
              <div id="local_speedtest_down" class="chart"></div>
            </td>
            <td class="chart_column">
              <div id="local_speedtest_up" class="chart"></div>
            </td>
          </tr>
          <tr>
            <td class="chart_column">
              <div id="remote_speedtest_down" class="chart"></div>
            </td>
            <td class="chart_column">
              <div id="remote_speedtest_up" class="chart"></div>
            </td>
          </tr>
          <tr>
            <td class="chart_column">
              <div id="edns_latency" class="chart"></div>
            </td>
            <td class="chart_column">
              <div id="idns_latency" class="chart"></div>
            </td>
          </tr>
          <tr>
            <td class="chart_column">
              <div id="bing_latency" class="chart"></div>
            </td>
            <td class="chart_column">
              <div id="google_latency" class="chart"></div>
            </td>
          </tr>
          <tr>
            <td class="chart_column">
              <div id="yahoo_latency" class="chart"></div>
            </td>
            <td class="chart_column">
              <div id="duration" class="chart"></div>
            </td>
          </tr>
          <tr>
            <td class="chart_column">
              <div id="my_signal" class="chart"></div>
            </td>
            <td class="chart_column">
              <div id="average_signal" class="chart"></div>
            </td>
          </tr>
          <tr>
            <td class="chart_column">
              <div id="best_signal" class="chart"></div>
            </td>
            <td class="chart_column">
              <div id="my_speed" class="chart"></div>
            </td>
          </tr>
          <tr>
            <td class="chart_column">
              <div id="temperature" class="chart"></div>
            </td>
            <td class="">
              <div id="" class="" align="middle">Super fun stuff would normally
                go here.</div>
            </td>
          </tr>
        </tbody>
      </table>
    </div>
    <div id="maia-signature">testing</div>
    <div id="maia-footer">testing</div>
    <script>
    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
    })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

    // If you use Google Analytics, put your identifier and domain name here.
    ga('create', 'IDENTIFIER', 'DOMAIN');
    ga('send', 'pageview');
    </script>
  </body>
</html>